<style>
    table.table-form-title{margin:20px auto 0;}
    table.table-form-title td{text-align: center;border-bottom:0 !important;}
    table.table{width:90%;margin:0 auto;}
    table.table-form-attach{margin-bottom:100px;}
    .opinion-list li{margin-bottom:10px;}
    .opinion-list .line1,.opinion-list .line2{line-height:24px;}
    .opinion-list .author, .opinion-list .time{margin-right:10px;}
</style>
<div style="margin:0 auto;">
    <table class="table-form-title table" style="margin-top:20px;">
        <tr>
            <td colspan="4" style="border-bottom: 0 !important;">
                <h2>${config.getKey("COMPANY_NAME")}</h2>
                <h2>${bpmTaskFrom.fromName}</h2>
                <input type="hidden" name="processInstanceId" value="${bpmForm.processInstanceId}" />
            </td>
        </tr>

    </table>
    <table class="table-form-head table table-hover table-bordered">
        <tr>
            <td width="15%"><span>发起时间：</span></td>
            <td class="text-left">

                <input class="form-control" name="createTime"  value="${bpmForm.createTime?string('yyyy-MM-dd')}" type="text" readonly="readonly"   >
            </td>
            <th>流水号</th>
            <td>
                <@f.input readonly=true value="${bpmForm.serialNumber}" name="serialNumber" placeholder="请输入流水号" required=true/>
            </td>
        </tr>

        <tr>
            <th>项目档案编号</th>
            <td class="text-left">
                <@f.input readonly=true value="${bpmForm.projectId}" name="projectId" placeholder="请输入项目档案编号" required=true/>

            </td>

            <th>项目经理</th>
            <td >
                <@f.input readonly=true value="${bpmForm.projectAdmin}"  name="projectAdmin" placeholder="请输入项目经理" required=true/>

            </td>
        </tr>

        <tr>
            <th>项目所属部门</th>
            <td colspan="3">
                <@f.input readonly=true value="${bpmForm.projectDept}"   name="projectDept" placeholder="请输入项目所属部门" required=true/>

            </td>
        </tr>

        <tr>
            <th>项目名称</th>
            <td colspan="3">

                <@f.input readonly=true value="${bpmForm.projectName}"   name="projectName" placeholder="请输入项目名称" required=true/>
            </td>
        </tr>

        <tr>
            <th>委托单位</th>
            <td colspan="3">
                <@f.input readonly=true value="${bpmForm.clientCompany}"   name="clientCompany" placeholder="请输入委托单位" required=true/>
            </td>
        </tr>
        <tr>
            <th>投标保证金或<br>
                招标代理费来源</th>
            <td class="text-left">
                <@f.input readonly=true value="${bpmForm.depositFrom}"  name="depositFrom" placeholder="投标保证金或招标代理费来源" required=true/>

            </td>
            <th >
                <@f.input readonly=true value="${bpmForm.depositFrom}"   name="depositFrom" placeholder="投标保证金或招标代理费来源" required=true/>
                金额
            </th>
            <td>
                <@f.input readonly=true value="${bpmForm.security}"   name="security" placeholder="请输入金额" required=true/>

            </td>
        </tr>

        <tr>
            <th>单位账户全称</th>
            <td class="text-left">
                <@f.input readonly=true value="${bpmForm.fullName}"   name="fullName" placeholder="请输入单位账户全称" required=true/>

            </td>

            <th>账号</th>
            <td >
                <@f.input readonly=true value="${bpmForm.account}"  name="account" placeholder="请输入账号" required=true/>

            </td>
        </tr>

        <tr>
            <th>开户行</th>
            <td class="text-left">
                <@f.input readonly=true value="${bpmForm.bank}"  name="bank" placeholder="请输入单位账户全称" required=true/>

            </td>

            <th>投标截止时间</th>
            <td >
                <input  class="form-control" name="bidDeadline"  value="${bpmForm.bidDeadline?string('yyyy-MM-dd')}" type="text" readonly="readonly"   >
            </td>
        </tr>



        <tr>
            <th>投标备注</th>
            <td colspan="3">
                <@f.input readonly=true value="${bpmForm.bidRemarks}"  name="bidRemarks" placeholder="请输入投标备注" required=true/>

            </td>
        </tr>

        <tr>
            <th>备注</th>
            <td colspan="3">
                <@f.input readonly=true value="${bpmForm.remark}"  name="remark" placeholder="请输入备注" required=true/>
            </td>
        </tr>
    </table>
</div>
<script type="text/javascript">

    function tableCallback(id, event, index, layero, nodes){
        console.log("aaaaaaaaaaaaaaa")
        if(id == "projectId"){
            console.log("弹出表格选择===>>>>: id:" + id + "  event:" + event + " index:" + index + "  layero:"+ layero + " nodes:" + JSON.stringify(nodes));
            console.log(nodes.table[0]);
            var data = nodes.table[0];
            console.log(data)
            console.log(data.department);
            console.log(data.ceoName);
            $("input[name=projectDept]").val(data.department);
            $("input[name=projectName]").val(data.projectName);
            $("input[name=projectAdmin]").val(data.ceoName);
            $("input[name=clientCompany]").val(data.contractFirst);
        }
    }


    $("button[name=btn-insert]").click(function () {
        var target = $(this).closest("table").find("tbody");
        var index = target.children().length + 1;
        var tpl = $(target.children().get(0)).prop("outerHTML");
        tpl = tpl.replaceAll("1", index);
        target.append(tpl);
    });
    $("button[name=btn-del]").click(function () {
        var target = $(this).closest("table").find("tbody");
        var index = target.children().length - 1;
        if(index>0){
            target.children().get(index).remove();
        }
    });
    $("button[name=btn-del-all]").click(function () {
        var target = $(this).closest("table").find("tbody");
        var index = target.children().length - 1;
        for(var i=index; i>0; i--){
            target.children().get(i).remove();
        }
    });
</script>